<template>
  <div
    class="w-auto h-auto collapse navbar-collapse max-height-vh-100 h-100"
    id="sidenav-collapse-main"
  >
    <ul class="navbar-nav" >
      <li class="nav-item" v-if="character !== 'factory' && character !== 'customer' && character !== 'admin'">>
        <sidenav-collapse navText="Dashboard" :to="{ name: 'Dashboard' }">
          <template #icon>
            <shop />
          </template>
        </sidenav-collapse>
      </li>
      <li class="nav-item" v-if="character === 'factory'">
        <sidenav-collapse navText="产能中心" :to="{ name: 'Efficiency' }">
          <template #icon>
            <shop />
          </template>
        </sidenav-collapse>
      </li>
      <li class="nav-item" v-if="character === 'factory'">
        <sidenav-collapse navText="设备管理" :to="{ name: 'EquipManage' }">
          <template #icon>
            <settings />
          </template>
        </sidenav-collapse>
      </li>
      <li class="nav-item" v-if="character === 'factory'">
        <sidenav-collapse navText="订单管理" :to="{ name: 'OrderManage' }">
          <template #icon>
            <document />
          </template>
        </sidenav-collapse>
      </li>
      <li class="nav-item" v-if="character === 'factory'">
        <sidenav-collapse navText="实时监控" :to="{ name: 'LiveCam' }">
          <template #icon>
            <customer-support />
          </template>
        </sidenav-collapse>
      </li>
      <li class="nav-item" v-if="character === 'customer'">
        <sidenav-collapse navText="选标" :to="{ name: '选标' }">
          <template #icon>
            <shop />
          </template>
        </sidenav-collapse>
      </li>
      <li class="nav-item" v-if="character === 'customer'">
        <sidenav-collapse navText="订单管理" :to="{ name: '经销商订单管理' }">
          <template #icon>
            <settings />
          </template>
        </sidenav-collapse>
      </li>
      <li class="nav-item" v-if="character === 'customer'">
        <sidenav-collapse navText="订单追踪" :to="{ name: '经销商订单追踪' }">
          <template #icon>
            <settings />
          </template>
        </sidenav-collapse>
      </li>
      <li class="nav-item" v-if="character === 'admin'">
        <sidenav-collapse navText="用户管理" :to="{ name: 'Member' }">
          <template #icon>
            <shop />
          </template>
        </sidenav-collapse>
      </li>
      <li class="nav-item" v-if="character === 'admin'">
        <sidenav-collapse navText="设备管理" :to="{ name: 'EquipmentM' }">
          <template #icon>
            <settings />
          </template>
        </sidenav-collapse>
      </li>
      <li class="nav-item" v-if="character === 'admin'">
        <sidenav-collapse navText="工厂管理" :to="{ name: 'FactoryM2' }">
          <template #icon>
            <customer-support />
          </template>
        </sidenav-collapse>
      </li>
      <li class="nav-item" v-if="character === 'admin'">
        <sidenav-collapse navText="产品管理" :to="{ name: 'Product' }">
          <template #icon>
            <credit-card />
          </template>
        </sidenav-collapse>
      </li>
    </ul>
  </div>
  <div class="pt-3 mx-3 mt-3 sidenav-footer">
    <sidenav-card
      :class="cardBg"
      textPrimary="想喝冰红茶？"
      textSecondary="对没错，这就是一则广告..."
      route="http://www.neu.edu.cn/"
      label="加入我们！！"
      icon="ni ni-diamond"
    />
    <a
      class="btn bg-gradient-success mt-4 w-100"
      href="https://baike.baidu.com/item/%E4%B8%9C%E8%BD%AF%E9%9B%86%E5%9B%A2/573400?fromtitle=Neusoft&fromid=5517891&fr=aladdin"
      type="button"
      target="_blank"
      >公司加盟指南</a
    >
  </div>
</template>
<script>
import SidenavCollapse from "./SidenavCollapse.vue";
import SidenavCard from "./SidenavCard.vue";
import Shop from "../../components/Icon/Shop.vue";
import CreditCard from "../../components/Icon/CreditCard.vue";
import CustomerSupport from "../../components/Icon/CustomerSupport.vue";
import Document from "../../components/Icon/Document.vue";
import Settings from "../../components/Icon/Settings.vue";

export default {
  name: "SidenavList",
  props: {
    cardBg: {
      type: String,
    },
    character: {
      type: String,
      default: "example"
    },
  },
  data() {
    return {
      title: "Cloud Factory",
      controls: "dashboardsExamples",
      isActive: "active",
    };
  },
  components: {
    SidenavCollapse,
    SidenavCard,
    Shop,
    CreditCard,
    CustomerSupport,
    Document,
    Settings,
  },
  methods: {
    getRoute() {
      const routeArr = this.$route.path.split("/");
      return routeArr[1];
    },
  },
};
</script>
